<template>
	<div class="container">
		<div class="title">参数设置</div>

		<div class="para_main">
			<div class="para_li">
				<div class="para_title">分组管理:</div>
				<div>
					<div class="para_info">
						<el-checkbox v-model="group" @change="setgroup"></el-checkbox>
						<div>启用分组管理</div>
					</div>
					<div class="para_zhu">启用可以设置工单的可见小组，小组内工程师可查看工单内容</div>

				</div>
			</div>
			<div class="para_li">
				<div class="para_title">必填项:</div>
				<div>
					<div class="para_info" v-for="item,index in zd">
						<el-checkbox v-model="item.isChoose" @change="setaddress(index)"></el-checkbox>
						<div>{{item.zdName}}</div>
					</div>
					<div class="para_zhu">设置创建工单中的必填字段</div>
				</div>

				<!-- <el-button type="primary" size="small" @click="setaddress">设置</el-button> -->
			</div>

			<div class="para_li">
				<div class="para_title">日报时间:</div>
				<div>
					<div class="para_info">
						<el-checkbox v-model="daya" @change="setday"></el-checkbox>
						<div>设置日报推送时间</div>
						<el-time-picker :editable="false" :clearable="false" style="width: 60px;margin-left: 20px;"
							v-model="time" @change="settime" format="HH:mm" value-format="HH:mm" placeholder="xx:xx">
						</el-time-picker>
					</div>
					<div class="para_zhu">设置时间，工单日报将在此时间发送到手机端</div>

				</div>
			</div>

			<div class="para_li">
				<div class="para_title">自动派单:</div>
				<div>
					<div class="para_info">
						<el-checkbox v-model="pick" @change="setpick"></el-checkbox>
						<div>PC端自动派单不显示派单确认页面，直接派单</div>
					</div>

				</div>
			</div>
			<div class="para_li">
				<div class="para_title">看板标题:</div>
				<div>
					<div class="para_info">
						<!-- <el-checkbox v-model="daya" @change="setday"></el-checkbox> -->
						<div style="white-space: nowrap;margin-right: 20px;">设置看板标题</div>
						<el-input v-model="ktitle" placeholder="请输入标题" @change="settitle"></el-input>
						<el-button type="primary" @click="gokb" style="margin-left: 20px;">打开看板
						</el-button>

						<!-- <el-button type="primary" @click="gokb2" style="margin-left: 20px;">打开项目看板</el-button> -->
					</div>
					<!-- <div class="para_zhu" >设置时间，工单日报将在此时间发送到手机端</div> -->

				</div>
			</div>
			<!-- <div class="para_li">
				<div class="para_title">看板标题:</div>
				<div>
					<div class="para_info">
						<el-button type="primary" @click="gokb2" style="margin-left: 20px;">打开看板</el-button>
					</div>

				</div>
			</div> -->
		</div>

		<div class="loading-content" v-if="showloading">
			<div class="loading-spinner">
				<svg viewBox="25 25 50 50" class="circular">
					<circle cx="50" cy="50" r="20" fill="none" class="path"></circle>
				</svg>
			</div>
			<div class="loading-text">加载中...</div>
		</div>

		<el-dialog title="" :visible.sync="dialogVisible" width="100%">

			<iframe :src="url + '/dp/index.html?token='+token" frameborder="0"></iframe>
		</el-dialog>

		<el-dialog title="" :visible.sync="dialogVisible2" width="100%">

			<iframe :src="'http://vue.fat-meow.com?token='+token" style="width: 100vw;height:100vh;"
				frameborder="0"></iframe>
		</el-dialog>
	</div>
</template>

<script>
	export default {
		name: "parameter",
		data() {
			return {
				group: false,
				dert: false,
				address: false,
				tel: false,
				type: false,
				showloading: false,
				dialogVisible: false,
				dialogVisible2: false,
				zd: [],
				time: "",
				ktitle: "",
				daya: "",
				pick: "",
				token: "",
				value1: new Date(2016, 9, 10, 18, 40),
			};
		},
		mounted() {
			this.url = window.location.origin; //去掉右括号
			// this.url = 'http://121.4.237.7'; //去掉右括号
			this.token = sessionStorage.getItem('token')
			this.getinfo()
			this.gettime()
			this.getktitle()
			this.getday()
			this.getaddress()
			this.getpick()
		},
		methods: {
			gokb() {
				// window.location.push('http://vue.fat-meow.com?token='+this.token)
				// this.$router.push('/dp')
				// const url = this.$router.resolve({
				// 	path: '/dp'
				// });
				var url = this.$url.replace('/gdtest', '')
				url = url.replace(/\/gd$/, '')
				console.log(url)
				window.open(url + '/dp/index.html?token=' + this.token, '_blank');
			},
			gokb2() {
				// window.location.push('http://vue.fat-meow.com?token='+this.token)
				// this.$router.push('/dp')
				const url = this.$router.resolve({
					path: '/dp'
				});
				window.open(url.href, '_blank');
			},
			// 设置自动派单
			setpick() {

				this.showloading = true
				var param = {
					value: this.pick ? 1 : 0
				}
				var that = this
				this.$http.post(this.$url + '/sysSet/set/picSkipArr', this.$qs.stringify(param))
					.then(function(response) {
						if (response.data.code == '1410') {
							that.$Toast(response.data.msg);
							sessionStorage.setItem('token', '')
							that.$router.push('/login')
							return
						}
						that.$Toast(response.data.msg);
						that.getpick()
						that.showloading = false
					})
					.catch(function(error) {
						console.log(error);
						that.$Toast('网络拥堵，刷新一下');
					});
			},
			// 获取自动派单
			getpick() {
				this.showloading = true
				var that = this
				this.$http.get(this.$url + '/sysSet/pcSkipArr')
					.then(function(response) {
						if (response.data.code == '1410') {
							that.$Toast(response.data.msg);
							sessionStorage.setItem('token', '')
							that.$router.push('/login')
							return
						}
						that.pick = response.data.data == 1 ? true : false
						that.showloading = false
					})
					.catch(function(error) {
						console.log(error);

						that.$Toast('网络拥堵，刷新一下');
					});
			},
			// 设置字段
			setaddress(i) {
				if (this.$permissions.indexOf(41) == -1) {
					this.$Toast('暂无权限');
					this.getaddress()
					// this.zd[i].isChoose = !this.zd[i].isChoose
					return
				}
				this.showloading = true
				console.log(this.zd)
				// for (var i = 0; i < this.zd.length; i++) {
				// if(this.zd[i].isChoose){
				var param = {
					id: this.zd[i].id,
					isChoose: this.zd[i].isChoose ? 1 : 0
				}
				var that = this
				this.$http.post(this.$url + '/main/updateZdChoose', this.$qs.stringify(param))
					.then(function(response) {
						if (response.data.code == '1410') {
							that.$Toast(response.data.msg);
							sessionStorage.setItem('token', '')
							that.$router.push('/login')
							return
						}
						that.$Toast(response.data.msg);
						that.getaddress()
						that.showloading = false
					})
					.catch(function(error) {
						console.log(error);
						that.$Toast('网络拥堵，刷新一下');
					});
				// }
				// }

			},
			// 设置分组
			getday() {
				this.showloading = true
				var that = this
				this.$http.get(this.$url + '/daily/getDailyInform')
					.then(function(response) {
						if (response.data.code == '1410') {
							that.$Toast(response.data.msg);
							sessionStorage.setItem('token', '')
							that.$router.push('/login')
							return
						}
						that.daya = response.data.data == 1 ? true : false
						that.showloading = false
					})
					.catch(function(error) {
						console.log(error);

						that.$Toast('网络拥堵，刷新一下');
					});
			},
			// 设置分组
			setgroup() {
				if (this.$permissions.indexOf(41) == -1) {
					this.$Toast('暂无权限');
					this.getinfo()
					return
				}
				this.showloading = true
				var param = {
					intValue: this.group ? 1 : 0
				}
				var that = this
				this.$http.post(this.$url + '/main/updateGdIsGrouped', this.$qs.stringify(param))
					.then(function(response) {
						if (response.data.code == '1410') {
							that.$Toast(response.data.msg);
							sessionStorage.setItem('token', '')
							that.$router.push('/login')
							return
						}
						that.$Toast(response.data.msg);
						that.getinfo()
						that.showloading = false
					})
					.catch(function(error) {
						console.log(error);
						that.$Toast('网络拥堵，刷新一下');
					});
			},
			// 设置分组
			setday() {
				if (this.$permissions.indexOf(41) == -1) {
					this.$Toast('暂无权限');
					this.getinfo()
					return
				}
				this.showloading = true
				var param = {
					intValue: this.daya ? 1 : 0
				}
				var that = this
				this.$http.post(this.$url + '/daily/switchDaily', this.$qs.stringify(param))
					.then(function(response) {
						if (response.data.code == '1410') {
							that.$Toast(response.data.msg);
							sessionStorage.setItem('token', '')
							that.$router.push('/login')
							return
						}
						that.$Toast(response.data.msg);
						that.getday()
						that.showloading = false
					})
					.catch(function(error) {
						console.log(error);
						that.$Toast('网络拥堵，刷新一下');
					});
			},
			// 设置分组
			settime(e) {
				// console.log(e)
				// return
				if (this.$permissions.indexOf(41) == -1) {
					this.$Toast('暂无权限');
					this.gettime()
					return
				}

				this.showloading = true
				var param = {
					time: e ? e : this.time
				}
				var that = this
				this.$http.post(this.$url + '/daily/newspaper/setTime', this.$qs.stringify(param))
					.then(function(response) {
						if (response.data.code == '1410') {
							that.$Toast(response.data.msg);
							sessionStorage.setItem('token', '')
							that.$router.push('/login')
							return
						}
						that.$Toast(response.data.msg);
						that.gettime()
						that.showloading = false
					})
					.catch(function(error) {
						console.log(error);
						that.$Toast('网络拥堵，刷新一下');
					});
			},
			// 设置标题
			settitle(e) {
				// console.log(e)
				// return
				if (this.$permissions.indexOf(41) == -1) {
					this.$Toast('暂无权限');
					this.getktitle()
					return
				}

				this.showloading = true
				var param = {
					title: e ? e : this.ktitle
				}
				var that = this
				this.$http.post(this.$url + '/sysSet/updateLookBoardTitle', this.$qs.stringify(param))
					.then(function(response) {
						if (response.data.code == '1410') {
							that.$Toast(response.data.msg);
							sessionStorage.setItem('token', '')
							that.$router.push('/login')
							return
						}
						that.$Toast(response.data.msg);
						that.getktitle()
						that.showloading = false
					})
					.catch(function(error) {
						console.log(error);
						that.$Toast('网络拥堵，刷新一下');
					});
			},
			//显示当前时间（年月日时分秒）
			timeFormate(timeStamp) {
				let hh = new Date(timeStamp).getHours() < 10 ? "0" + new Date(timeStamp).getHours() : new Date(timeStamp)
					.getHours();
				let mm = new Date(timeStamp).getMinutes() < 10 ? "0" + new Date(timeStamp).getMinutes() : new Date(
					timeStamp).getMinutes();
				this.time = hh + ":" + mm;
			},
			// 查看标题
			getktitle() {
				this.showloading = true
				var that = this
				this.$http.get(this.$url + '/sysSet/getLookBoardTitle')
					.then(function(response) {
						if (response.data.code == '1410') {
							that.$Toast(response.data.msg);
							sessionStorage.setItem('token', '')
							that.$router.push('/login')
							return
						}
						that.ktitle = response.data.msg
						that.showloading = false
					})
					.catch(function(error) {
						console.log(error);

						that.$Toast('网络拥堵，刷新一下');
					});

			},
			// 查看日报时间
			gettime() {
				this.showloading = true
				var that = this
				this.$http.get(this.$url + '/daily/newspaper/getTime')
					.then(function(response) {
						if (response.data.code == '1410') {
							that.$Toast(response.data.msg);
							sessionStorage.setItem('token', '')
							that.$router.push('/login')
							return
						}
						that.time = response.data.msg
						that.showloading = false
					})
					.catch(function(error) {
						console.log(error);

						that.$Toast('网络拥堵，刷新一下');
					});

			},
			// 查询是否开启分组
			getinfo() {
				this.showloading = true
				var that = this
				this.$http.get(this.$url + '/main/getGdIsGrouped')
					.then(function(response) {
						if (response.data.code == '1410') {
							that.$Toast(response.data.msg);
							sessionStorage.setItem('token', '')
							that.$router.push('/login')
							return
						}
						that.group = response.data.data == 1 ? true : false
						sessionStorage.setItem('opengroup', that.group)
						that.showloading = false
					})
					.catch(function(error) {
						console.log(error);

						that.$Toast('网络拥堵，刷新一下');
					});

			},
			// 查看字段是否必填
			getaddress() {
				this.showloading = true
				var that = this
				this.$http.get(this.$url + '/main/getZdChoose')
					.then(function(response) {
						if (response.data.code == '1410') {
							that.$Toast(response.data.msg);
							sessionStorage.setItem('token', '')
							that.$router.push('/login')
							return
						}
						for (var i = 0; i < response.data.data.length; i++) {
							response.data.data[i].isChoose = response.data.data[i].isChoose == 1 ? true : false
							if (response.data.data[i].zdName == '报修科室') {
								sessionStorage.setItem('dert', response.data.data[i].isChoose)
							} else if (response.data.data[i].zdName == '报修地址') {
								sessionStorage.setItem('address', response.data.data[i].isChoose)
							} else if (response.data.data[i].zdName == '报修人电话') {
								sessionStorage.setItem('tel', response.data.data[i].isChoose)
							} else if (response.data.data[i].zdName == '故障分类') {
								sessionStorage.setItem('type', response.data.data[i].isChoose)
							}
						}
						that.zd = response.data.data

						that.showloading = false
					})
					.catch(function(error) {
						console.log(error);

						that.$Toast('网络拥堵，刷新一下');
					});

			},
		},
	}
</script>

<style scoped>
	/deep/ .el-dialog__body {
		padding: 0;
		height: calc(100vh - 57px)
	}

	/deep/ .el-dialog__headerbtn {
		top: 8px;
	}

	/deep/ .el-dialog__header {
		padding: 10px 20px 10px;
	}

	/deep/ .el-dialog {
		margin-top: 0 !important;
		height: 100vh;
		margin-bottom: 0;
	}

	/deep/.el-input--prefix .el-input__inner {
		padding: 0;
		text-align: center;
	}

	/deep/ .el-input__prefix {
		display: none;
	}

	.para_zhu {
		position: absolute;
		color: #be845f;
		margin-left: 33px;
	}

	.para_btn {
		padding: 5px 15px;
		border-radius: 5px;
		color: #fff;
		background: #4286F5;
		cursor: pointer;
	}

	.el-checkbox {
		margin-right: 10px;
		margin-bottom: 0;
	}

	.para_title {
		font-size: 16px;
		color: #000;
		font-weight: bold;
		width: 200px;
	}

	.para_info {
		display: flex;
		align-items: center;
		font-size: 16px;
		color: #333;
		margin-right: 50px;
	}

	.para_li {
		display: flex;
		/* align-items: center; */
		margin-bottom: 50px;
		border-bottom: 1px solid #ddd;
		padding-bottom: 80px;
		position: relative;
	}

	.para_li:nth-last-of-type(1) {
		border-bottom: none;
	}

	.para_main {
		padding: 30px 0;
		overflow-y: auto;
		height: calc(100vh - 100px);
	}

	.title {
		font-size: 24px;
		color: #000000;
	}
</style>
